要談網頁的設計思考，最大的主軸還是圍繞在 UX（使用者經驗 User Experiecne）。

其實 UX 是一種經驗，遇過的越多，你就能把越多好的經驗套用在你自己的作品上。

舉個例子，你今天要去一間百貨公司上廁所，廁所超高級、裝潢超級華麗，結果當你上完的時候，發現廁所裡沒有衛生紙架，理所當然也沒有衛生紙。這時候裝潢再奢華也沒有用，一定會大大降低你以後來這裡上廁所的意願。
套用在網頁上的話，這就是典型的 UI 很美、UX 很爛的案例。

網頁很美當然很重要，畢竟那是使用者點進來的第一印象。
但點進來就要開始操作了，用一用發現按不回首頁，點商品卻進不了結帳頁面，你覺得使用者還會想買你的東西嗎？八成不會。

十大易用性原則就是讓你在設計網頁流程的時候大原則，讓使用者操作起來的感覺至少是順暢的，也明確自己在操作的流程目前的狀況。這些原則對於使用者的感受很重要，但可能確是在網頁開發過程裡常常被忽略的。

1. 查看系統的狀態 Visibility of system status　

最經典案例的就是進度條，Google 搜尋打 loading 會跑出一拖拉庫的的進度條範例

不管是做成轉圈圈的，或是進度條告訴你目前到了幾 %，都是讓你知道系統目前到哪了。

若你點下一個按鈕，結果跑出一頁空白，也不知道系統到底是在載入中還是直接卡住，你會有什麼反應呢？大部分的人可能是不停地按 F5 重新整理，或是直接把網頁關掉。有很多搶票系統卡住的時候就是一面白這樣：）

2. 連結系統與真實世界 Match between system and the real world

資訊科技上總有很多專業術語，例如批次管理。
下圖是我在工作時真實遇到的狀況，它是簡單的公佈欄，發佈後系統會預設在這個狀態，大多數使用者不知道要怎麼將文章刪除。

原來刪除藏在批次管理的下拉選單裡的刪除，如下圖。

大多數使用者看到批次管理是不會去按的，因為批次管理一點也不屬於日常口語會用到的詞彙，只有鮮少數的使用者會把刪除功能聯想到管理。

3. 使用者操控自由度 User control and freedom

雖然理想的系統，無論在 UI/UX 的設計上都應該直觀、好操作，但仍然無法避免使用者的錯誤操作，無論是刻意嘗試錯誤、或是不小心的錯誤，系統在錯誤的操作上都應該賦予使用者 ctrl+z 的功能。
我自己是長期的 Telegram 的使用者，Telegram 在防呆機制也做了很多。像是刪掉訊息的五秒內會有 toast 提示告訴你是否復原。

我自己最常做的就是不小心往左滑掉變成封存訊息，每次封存之後都要找好久怎麼復原，Telegram 在這塊也有做復原機制，一樣用 toast 提示呈現，讓你不小心刪掉訊息可以即時挽救。

4. 一致性和標準化 Consistency and standards

完整的系統應該在系統無論是用字、配色等都應該有一致性，避免讓使用者猜測。
若一個系統的不同頁面裡的確認有橘色有紅色、取消返回分別是藍色和綠色，使用者在每個按下按鈕的時刻會對這件事感到疑惑，相對地不直覺。

5. 預防錯誤 Error prevention

可以的話，在使用者做錯的當下就立刻反饋讓使用者知道「你做錯了」。盡可能避免在使用者已經做錯，按下按鈕送出才發現自己做錯了。另外在跳出錯誤提示時也盡可能明確闡述錯在哪裡，避免 user 不斷嘗試嘗試最後發現自己做錯。
例如 Microsoft 官網的變更密碼，除了闡述密碼設定規則，在設立不符合規則的密碼當下也即刻跳出錯誤題是告訴使用者此密碼不符規定。

下一篇：十大易用性原則（2/2）